<template>
	<view class="index-box" :style="{ '--color': vuex_config.themeColor1,'--price':vuex_config.price }">
		<sww-wx-address></sww-wx-address>
		<view class="box">
			<!-- 规格信息-->
			<prod-list :selectList="selectList"></prod-list>
			<!-- 优惠券、备注 -->
			<order-cell ref="order_cell" v-model="couponPrice" :productIds="productIds" :prodPrice="allProdPrice">
			</order-cell>
		</view>
		<!-- 支付方式 -->
		<view class="box">
			<sww-pay-type v-model="dataForm.pay_type" :price="totalPrice"></sww-pay-type>
		</view>
		<sww-goods-action>
			<view class="sub-price">
				<text class="">总计：</text>
				<text class="sww-tp">￥{{ $price(totalPrice) }}</text>
			</view>
			<view class="sub-btn" @click="onSubmit">提交订单</view>
		</sww-goods-action>
		<sww-login></sww-login>
	</view>
</template>
<script>
	import {
		payOrder
	} from '@/mixins/payOrder';
	import {
		confirm
	} from '../components/orderConfirm/index.js';
	import prodList from '../components/orderConfirm/prodList.vue';
	import orderCell from '../components/orderConfirm/orderCell.vue'
	export default {
		mixins: [confirm, payOrder],
		components: {
			prodList,
			orderCell
		},
		data() {
			return {
				order_type: 12
			};
		},
		methods: {
			// 提交表单
			onSubmit() {
				this.$login('onSubmit').then(res => {
					this.$u.debounce(
						() => {
							if (!this.vuex_address) {
								this.$toast('请选择收货地址');
								return;
							}
							// this.$toast('当前地址是否在配送区域')
							if (!this.$checkCanBuyFromPostageModule()) return;
							let json = this.selectList.map((item, index) => {
								return {
									fk_pro_id: item.product_id,
									num: item.num,
									price: item.price,
									fk_stock_id: item.fk_attr_id,
									name: item.standard
								};
							});
							let couponItem = this.$refs.order_cell.couponItem
							let params = {
								...this.vuex_address,
								remark: this.$refs.order_cell.remark || '',
								postage: this.prodPostage, // 邮费
								total_amount: this.totalPrice, // 订单总金额
								coupon_id: couponItem.pk_id || '0',
								coupon: couponItem.price || '0',
								json_detailed: JSON.stringify(json)
							};
							if (params.coupon_id && params.coupon_id != '0') params.remark +=
								`;使用优惠券${couponItem.price}`;
							this._submitOrder(params, {
								totalPrice: params.total_amount,
								pay_type: this.dataForm.pay_type,
								order_type: this.order_type,
								orderApi: 'AddOrderBonus'
							});
						},
						1000,
						true
					);
				})

			}
		}
	};
</script>
<style>
	page {
		background-color: #f5f5f5;
	}
</style>
<style lang="scss" scoped>
	.index-box {
		width: 100%;

		.box {
			width: 100%;
			padding: 0 24rpx;
			background-color: #ffffff;
			margin-bottom: 10rpx;
		}

		.sub-price {
			padding-left: 30rpx;
			font-size: 36rpx;
			font-weight: bold;
		}

		.sub-btn {
			width: 250rpx;
			height: 100rpx;
			background: var(--color);
			display: flex;
			align-items: center;
			justify-content: center;
			color: #ffffff;
			font-size: 30rpx;
			margin-left: auto;
		}
	}
</style>
